﻿Vue.component("fenye", {
    template: `
                <div id="pageDiv">
                <div id="leftPage">共有{{rows}}条记录，当前第<span id="dq">{{cpage}}</span>/<span id="zong">{{pages}}</span>页</div>
                <div id="rightPage">
                    <input type="image" src="../images/first.gif" v-on:click="Shouye()" />&nbsp;&nbsp;
                    <input type="image" src="../images/back.gif" v-on:click="Prev()" />&nbsp;&nbsp;
                    <input type="image" src="../images/next.gif" v-on:click="Next()" />&nbsp;&nbsp;
                    <input type="image" src="../images/last.gif" v-on:click="Foot()" />&nbsp;&nbsp;
                    转到第<input type="text" size="1" id="tiao" />&nbsp;&nbsp;<img src="../images/go.gif" v-on:click="Tiao()" />
                </div>
            </div> 
             `,
    props: ['rows', 'cpage', 'pages'],
    data: function () {
        return {
            currentpage: 1,
            aa:1
        }
    },
    methods: {
        load: function () {
            var t = this;
            $.ajax({
                url: "fenye.ashx?currentPage=" + t.currentpage + "&aa=" + 1 ,
                type: "get",
                success: function (zhi) {
                    var datas = eval("(" + zhi + ")");
                    datas["cpage"] = t.currentpage;
                    t.$emit('ss', datas);
                }
            })
        },
        //下一页
        Next: function () {
            var t = this;
            var dq = $("#dq").text();
            var zong = $("#zong").text();
            if (dq != zong) {
                t.currentpage +=1;
                t.load();
            } else {
                alert("当前页是最后一页");
            }
        },
        //上一页
        Prev: function () {
            var t = this;
            var dq = $("#dq").text();
            if (dq != 1) {
                t.currentpage -=1;
                t.load();
            } else {
                alert("当前是第一页");
            }

        },
        //首页
        Shouye: function () {
            var t = this;
            t.currentpage = 1;
            t.load();
        },
        //尾页
        Foot: function () {
            var t = this;
            t.currentpage = $("#zong").text();
            t.load();
        },
        //跳转
        Tiao: function () {
            var t = this;
            t.currentpage = $("#tiao").val();
            var zong = $("#zong").text();
            if (t.currentpage <= zong && t.currentpage > 0) {
                t.load();
            } else {
                alert("没有该页");
                location.reload();
            }
        }
    }







});